import Vue from 'vue'
import Router from 'vue-router'
import TemplateHome from './components/Templatehome.vue'
import Home from './views/Home.vue'
import Login from './views/Login.vue'
import About from './views/About.vue'

Vue.use(Router);

const routes = [
  {
    path: '/about',
    name: 'about',
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ './views/About.vue')
  },
  {
    path: '/login',
    name: 'login',
    component: Login
  },
  {
    path: '/',
    name: 'dashboard',
    component: TemplateHome,
    redirect: '/dashboard',
    children: [
      { path: 'dashboard', name: 'dashboard', component: Home}
    ]
  },
  {
    path: '/about',
    name: 'about',
    component: TemplateHome,
    redirect: '/about/abouttest',
    children:[
        {path: 'abouttest', component: () => import(/* webpackChunkName: "about" */ './views/About.vue')},
        {path: 'hello/:name',component:About,props:true},
        {path:'static',component:About,props:{name:'world'}},
        {path:'attrs',component:About,props:{name:'attrs',test:'45'}},
        {path:'dynamic/:years',component:About,props:dynamicPropsFn},
        {path:'pramas',name:'pramas',component:About,props:true}
    ]
  }
];

const router = new Router({
  routes: routes
});
function dynamicPropsFn(route){
  const now=new Date();
  return {
    name:(now.getFullYear()+parseInt(route.params.years))+"!",
    query:route.query.q,
    ui:route.query.u
  }
}
router.beforeEach((to, from, next) => {
  if (to.path == '/Login') {
      sessionStorage.removeItem('user');
  }
  let result = sessionStorage.getItem('user');
  if (!result && to.path != '/Login') {
      next({ path: '/Login' });
  } else {
      next()
  }
});

export default router;
